import {createApp} from 'vue'
import {computed, designComponent, designPage, onBeforeUnmount, onMounted, reactive, watch} from 'plain-ui-composition'
import {createCmsPreview, iReactivityApi} from 'react-cms-visual-editor'
import visualData from "./data.json";
import App from './welcome/App.vue'

const Preview = designPage(() => {

    const reactivityApi: iReactivityApi = {reactive, computed, type: 'vue', designComponent, onMounted, onBeforeUnmount, watch}
    const data = visualData
    const CmsPreview = createCmsPreview(reactivityApi)

    return () => (
        <>
            <CmsPreview data={data}/>
            <App/>
        </>
    )
})


createApp(<Preview/>).mount('#app')
